<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<script type="text/javascript" src="../../js/base.js" ></script>
	<body>
		<div id="">
			在html中表单是由<from>元素来表示的，而在javascript中表单对应的则是
				HTMLFormElement类型。HTMLFormElement继承了HTMLElement,因此它拥有HTML元素
				具有的默认属性并且还独有自己的属性和方法。
		</div>
		
	<form id="myform" name="youForm">
	姓名：<input type="text" name="user" value="123"/>	
	<input id='sub' type="submit" value="提交" />
	<input id="but" type="button" value="我是button我不能提交" />
		
	</form>
	</body>
</html>
<script>
	window.addEventListener('load',function(){
		var sub =document.getElementById('sub');
		var fm =document.getElementById('myform');//通过id获取<from>元素
	//	var fm = document.getElementsByTagName('from')[0];//使用获取第一个元素方式获取
	
	//	var fm = document.forms[0];//使用froms的数字下标获取元素 ；   html的方法
	//	var fm =document.forms['youForm'];//使用froms的名称下标获取元素 ；  html的方法
		//alert(fm);//[object HTMLFormElement]
		
		//阻止提交
	addEventListener('submit',function(eve){
		preDef(eve);
		},false);
		//ps: 传统方式：fm.onsubmit = function(){} 采用form对象禁止事件
		//把submit事件注册到input中的submit按钮是无法触发submit事件的。
		//必须把submit事件绑定到form对象上才可以触发submit事件，只不过触发事件的流程是点击input中的submit按钮而已
		//submit事件改sub无法触发，但是click事件可以触发
		
		
	/*	addEvent(fm,'submit',function(eve){
			alert(eve);
			preDef(eve);
		});
		
		addEvent(sub,'click',function(eve){
			alert(eve);
			preDef(eve);
		});*/
		
		//可以使得非submit按钮提交
	var button	=document.getElementById('but');
	addEventListener('click',function(){
		fm.submit();
	},false);
		
	//使用ctrl+enter实现提交
	addEvent(document,'keydown',function(eve){
		var e =eve||window.event;
		if(e.ctrlKey&& e.keyCode ==13){
			fm.submit();
		}
	});
	
		
		
	},false);
</script>
